
<div class="row contentArea_leftDiv_forTree">
<div class="row searchDiv" style=" padding: 10px 10px 10px 10px;">
        <input type="text" class="input_style"
            #queryCriteria="ngModel"
            name="searchData"
            (keydown.enter)="_leftRetrieval(queryCriteria.value)"
            placeholder="请输入名称检索"
            (input)="changesearch()"
            (keyup.enter)="changesearch()"
            [(ngModel)]="searchData"
            />
            <button class="btn btn-search btn-blue" style="margin-right: 0px !important;" mat-button
            (click)="search()"
            >查询
            </button>
    </div>
    <div class="row synonymContent" data-spy="scroll" data-target=".letterDiv">
        <div class="synonymDiv">
            <div class="synonymBar"  *ngFor="let key of tabVal | keys" id="leftSynonym_{{ key }}">
                <div class="synonymBar-title">{{ key }}</div>
                <div class="synonymBar-content">
                    <div class="synonymBar-contentLi" *ngFor="let v of tabVal[key]">{{ v }}</div>
                </div>
            </div>
        </div>
        <div class="letterDiv">
            <div class="letterStyle" (click)="goTo('leftSynonym_A')">A</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_B')">B</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_C')">C</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_D')">D</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_E')">E</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_F')">F</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_G')">G</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_H')">H</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_I')">I</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_J')">J</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_K')">K</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_L')">L</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_M')">M</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_O')">O</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_P')">P</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_Q')">Q</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_R')">R</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_S')">S</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_T')">T</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_U')">U</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_V')">V</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_W')">W</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_X')">X</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_Y')">Y</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_Z')">Z</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_#')">#</div>
        </div>
    </div>
</div>
    
    
<!-- <div class="contentArea_leftDiv">
    <div class="row searchDiv" style=" padding: 10px 10px 10px 10px;">
        <input type="text" class="input_style"
          #queryCriteria="ngModel"
          name="searchData"
          (keydown.enter)="_leftRetrieval(queryCriteria.value)"
          placeholder="请输入名称检索"
          (input)="changesearch()"
          (keyup.enter)="changesearch()"
          [(ngModel)]="searchData"
          />
          <button class="btn btn-search btn-blue" style="margin-right: 0px !important;" mat-button
            (click)="search()"
            >查询
          </button>
    </div>
    <div class="row synonymContent" data-spy="scroll" data-target=".letterDiv">
        <div class="synonymDiv">
            <div class="synonymBar"  *ngFor="let key of tabVal | keys" id="leftSynonym_{{ key }}">
                <div class="synonymBar-title">{{ key }}</div>
                <div class="synonymBar-content">
                    <div class="synonymBar-contentLi" *ngFor="let v of tabVal[key]">{{ v }}</div>
                </div>
            </div>
        </div>
        <div class="letterDiv">
            <div class="letterStyle" (click)="goTo('leftSynonym_A')">A</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_B')">B</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_C')">C</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_D')">D</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_E')">E</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_F')">F</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_G')">G</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_H')">H</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_I')">I</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_J')">J</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_K')">K</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_L')">L</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_M')">M</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_O')">O</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_P')">P</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_Q')">Q</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_R')">R</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_S')">S</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_T')">T</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_U')">U</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_V')">V</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_W')">W</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_X')">X</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_Y')">Y</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_Z')">Z</div>
            <div class="letterStyle" (click)="goTo('leftSynonym_#')">#</div>
        </div>
    </div>
</div> -->
